<template>
	<view class="login_body">
		<view class="login_content">
			<h1>登录掌上高新</h1>
			<!-- <view class="login_content_view">
				<span class="iconfont icon-wode icon"></span>
				<input type="text" placeholder="请输入账号" maxlength="24" v-model="login.username"
					placeholder-class="input_placeholder" />
			</view>
			<view class="login_content_view">
				<span class="iconfont icon-mima3 icon" open-type="redirect"></span>
				<input type="password" ref="passinput" placeholder="请输入密码" maxlength="24" v-model="login.password"
					placeholder-class="input_placeholder" />
			</view> -->
			<button type="default" @click="getUserProfile">立即登录</button>
		</view>
		<view class="botton-style">四川哈工创兴大数据有限公司提供技术支持</view>
	</view>
</template>


<script>
	import {
		login,
		wxLogin,
		getInfo
	} from '@/common/js/api/user.js'
	export default {
		data() {
			return {
				navUrl: '',
				code: '',
			}
		},
		onLoad() {
			let that = this;
			uni.login({
				success: function(res) {
					if (res.code) {
						that.code = res.code
						
					}
				}
			});
		},
		methods: {
			getUserProfile() {
				let that = this;
				// 推荐使用uni.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认
				// 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
				//先清除原来得token
				uni.getUserProfile({
					desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (resp) => {
						that.loginByWeixin(resp)
					}
				})
			},
			loginByWeixin: function(userInfo) {
				let storageInfo =  userInfo.userInfo
				let that = this;
				// //登录远程服务器
				wxLogin(userInfo, that.code).then(res => {
					uni.setStorageSync("token", res.token);
					let info = res.userInfo
					for (let key in info){
						storageInfo[key] = info[key]
					}
					//缓存获取到的用户信息
					uni.setStorageSync("userInfo", storageInfo);
					// getInfo().then(res => {
					// 	// console.log("登录成功");
					// 	uni.setStorageSync("userInfo", res.user);
					// 	
					// })
					uni.switchTab({
						url: '/pages/index/index',
					})
				});
			},
		}
	}
</script>

<style>
	.login_body {
		width: 100%;
		height: 100%;
		background: white;
		/* background-image: url(@/static/image/login/login_bg.png); */
		background-size: cover;
		background-position: 50%;
		position: absolute;
		display: flex;
		flex-direction: column;
		flex-wrap: wrap;
		align-content: center
	}

	.login_body .login_content {
		align-content: center;
		justify-content: center;
		align-items: center;
	}

	.login_body .login_content h1 {
		color: rgba(24, 132, 235, 1);
		font-family: PingFang SC;
		font-weight: bold;
		font-size: 50rpx;
		text-align: center;
		margin-top: 30%;
		margin-bottom: 100rpx;
	}

	.login_content_view {
		display: table;
		width: 100%;
		border-bottom: 1rpx solid #86A7CB;
	}

	.login_content input {
		color: black;
		margin: 80rpx auto;
		height: 100%;
		display: table-cell;
		vertical-align: middle;
		padding: 10px 0 10px 0;
	}

	.input_placeholder {
		color: #86A7CB;
		font-size: 14px;
	}

	.login_content .icon {
		color: #86A7CB;
		font-size: 40rpx;
		display: table-cell;
		vertical-align: middle;
	}

	.login_content button {
		width: 600rpx;
		color: white;
		background-color: #8ac1f4;
		margin-top: 30px;
	}

	.botton-style {
		width: 100%;
		bottom: 15px;
		position: fixed;
		text-align: center;
		color: #4776A5;
	}
</style>
